// Cover modal for adding products to basket
.cover-wrap {
    background: fade(@brand-success, 80%);
    color: #fff;
    position: fixed;
    text-align: center;
    display: table;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0;
    visibility: hidden;
    z-index: -40;
    .transition(all 0.3s);

    &.in {
        z-index: 3000;
        opacity: 1;
        visibility: visible;
    }

    .text-wrap {
        display: table-cell;
        width: 100%;
        height: 100%;
        vertical-align: middle;
        position: relative;
        padding: 30px;

        .load {
            display: none;
            position: absolute;
            top: 50%;
            left: 0%;
            width: 100%;
            margin-top: -2em;
            i {
                font-size: 2.5em;
            }
        }
        .ready {
            opacity: 0;
            .scale(0.5);
            .transition(all 0.2s);
            i {
                font-size: 5em;
                margin-bottom: 20px;
            }
        }
        .error-msg {
            display: none;
            i {
                font-size: 5em;
                margin-bottom: 20px;
            }
        }
        p {
            font-size: 1.75em;
            text-transform: uppercase;
            font-weight: 500;
        }
    }

    &.loading {
        .load {
            display: block;
        }
        .ready {
            .scale(1);
        }
    }

    &.loaded {
        .ready {
            opacity: 1;
            .scale(1);
        }
    }

    &.error {
        background: fade(@brand-danger, 80%);
        .error-msg {
            display: block;
        }
        .ready {
            display: none;
        }
    }
}
